import axios from '@/utils/request'

export default {
  Bond: {
    list: {
      export: {
        query: {
          '@display': `{
            'id' : 'entity.getId()',
            'store' : 'entity.getStore().__toString()',
            'staff' : 'entity.getStaff().__toString()',
            'role' : 'entity.getStaff().getRole().__toString()',
            'user' : 'entity.getUser().__toString()',
            'fee' : 'entity.getFee()',
            'payable' : 'entity.getPayable()',
            'balance' : 'entity.getBalance()',
            'comment' : 'entity.getComment()'
          }`,
          limit: 10000000
        },
        label: {
          'id': 'id',
          'store': '门店',
          'staff': '业务',
          'role': '角色',
          'user': '用户',
          'fee': '保证金',
          'payable': '欠款',
          'balance': '保证金户余额',
          'comment': '备注'
        }
      },
      query: {
        '@expands': '["entity.staff"]'
      },
      disabled_actions: ['delete'],
      actions: [
        {
          name: 'transfer-platform',
          position: 'list',
          component: {
            props: ['record', 'refresh'],
            data() {
              return {
                loading: false
              }
            },
            render(h) {
              if (this.record.balance > 0) {
                return (
                  <el-popconfirm title='确定将保证金户余额转移至平台？'
                    {...{
                      on: {
                        onConfirm: (val) => {
                          this.loading = true
                          axios.post(`/manage/transactions/send/from/${this.record.account.id}/to/105/amount/${this.record.balance}`, { comment: '保证金户余额转移至平台' }
                          ).then((res) => {
                            this.$message.success('执行成功！')
                            this.refresh()
                          }).finally(() => {
                            this.loading = false
                          })
                        }
                      }
                    }}>
                    <el-button slot='reference' size='small' type='warning' icon='el-icon-refresh' loading={this.loading} plain>余额转移平台</el-button>
                  </el-popconfirm>
                )
              }
            }
          }
        }
      ],
      list_filter: {
        'store.id': () => {
          return axios
            .get(`/manage/stores`)
            .then(res =>
              Object.assign({ __label: '门店' },
                ...res.data.map(v => { return { [v.id]: v.name } })))
        },
        'role': {
          expression: 'entity.getStaff().getRole().getId() == ":value"',
          label: '角色',
          type: 'remote-select',
          data: [],
          remoteMethod: (query, context) => {
            axios
              .get(`/manage/roles`, { params: {
                '@filter': `entity.getName() matches "${query}"`
              }})
              .then(res => {
                context.data = res.data.map(v => { return { value: v.id, label: v.name + '(' + v.store.__toString + ')' } })
              })
          }
        },
        name: {
          expression: `entity.getStaff().getName() matches ":value" || entity.getStaff().getUser().getUsername() matches ":value"`,
          label: '员工名/电话',
          type: 'input'
        },
        staffId: {
          expression: `entity.getStaff().getId() == ":value"`,
          label: '员工id',
          type: 'input'
        }
      },
      list_display: [
        'id',
        { property: 'staff.__metadata.store.__toString', label: '门店' },
        'staff',
        { property: 'staff.__metadata.user.__toString', label: '用户' },
        { property: 'fee', label: '保证金', editable: true },
        { property: 'payable', label: '欠款' },
        { property: 'balance', label: '保证金户余额' },
        'comment'
      ]
    },
    form: {
      fields: [
        {
          property: 'store',
          field_options: { label: '门店' },
          component: {
            props: ['form', 'property'],
            data() {
              return { data: [] }
            },
            created() {
              axios.get(`/manage/stores`, {
                params: {
                  'limit': 1000000
                }
              }).then((res) => {
                this.data = res.data
              })
            },
            render(h) {
              return (
                <el-select v-model={this.form[this.property]} clearable filterable onChange={() => { this.form['staff'] = null }}>{
                  Object.assign(this.data).map(v => {
                    return <el-option key={v.id} label={v.name} value={v.id} />
                  })
                }</el-select>
              )
            }
          }
        },
        {
          property: 'staff',
          component: {
            props: ['form', 'property'],
            data() {
              return { data: [] }
            },
            methods: {
              setOptions(value) {
                if (value) {
                  axios.get(`/manage/staffs`, {
                    params: {
                      '@filter': `entity.getStore().getId() == ${value}`,
                      'limit': 1000000
                    }
                  }).then((res) => {
                    this.data = res.data
                  })
                } else {
                  this.data = []
                }
              }
            },
            watch: {
              'form.store': {
                handler(value, oldValue) {
                  this.setOptions(value)
                },
                immediate: true
              }
            },
            render(h) {
              return (
                <el-select v-model={this.form[this.property]} clearable filterable>{
                  Object.assign(this.data).map(v => {
                    return <el-option key={v.id} label={v.name + '(' + v.phone + ')'} value={v.id} />
                  })
                }</el-select>
              )
            }
          }
        },
        { property: 'fee', field_options: { label: '保证金' }},
        { property: 'comment', type: 'textarea' }
      ]
    }
  }
}

